<template>
  <div class="detail-info">
    <p class="detail-desc">{{ detailInfo.desc }}</p>
    <div class="detail-image" v-if="detailInfo.detailImage">
      <img
        :src="item"
        v-for="item in detailInfo.detailImage[0].list"
        :key="item"
        @load="imgLoad"
      />
    </div>
  </div>
</template>

<script>
export default {
  props: {
    detailInfo: {
      type: Object,
      default() {
        return {};
      },
    },
  },
  methods: {
    imgLoad() {
      // 把事件传给父组件
      this.$emit("imgLoad");
    },
  },
};
</script>

<style scoped lang="less">
.detail-desc {
  padding: 20px 10px;
  color: #333;
}
.detail-image {
  img {
    width: 100%;
  }
}
</style>
